.tit {
    color: #c6350a;
    font-weight: bold;
    text-transform: uppercase;
    letter-spacing: 1px;
}
.cli {
    text-align: center;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
.carto {
    display: flex;
    justify-content: space-around;
}
.choix {
    width: 50vh;
}





.mini {
    width: 100%;
    margin-left: 50%;
    transform: translateX(-50%);
}



.diana:hover {
    fill: url(#DianaSar);
    stroke: white;
    stroke-width: 0.1px;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.diana {
    fill: rgb(255, 0, 0);
    stroke: rgb(255, 0, 0);
    stroke-width: 1px;
}

.diana-text {
    display: block;
    font-size: 40px;
    font-weight: bold;
    fill: black;
    text-anchor: middle;
    pointer-events: none;
}

.diana:hover+.diana-text {
    display: none;
}






.sava:hover {
    fill: url(#SavaSar);
    stroke: white;
    stroke-width: 0.1px;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.sava {
    fill: rgb(0, 0, 255);
    stroke: rgb(0, 0, 255);
    stroke-width: 1px;
}

.sava-text {
    display: block;
    font-size: 45px;
    font-weight: bold;
    fill: black;
    text-anchor: middle;
    pointer-events: none;
}

.sava:hover+.sava-text {
    display: none;
}









.sofia:hover {
    fill: url(#SofiaSar);
    stroke: white;
    stroke-width: 0.1px;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.sofia {
    fill: rgb(255, 255, 0);
    stroke: rgb(255, 255, 0);
    stroke-width: 1px;
}
.sofia-text {
    display: block;
    font-size: 45px;
    font-weight: bold;
    fill: black;
    text-anchor: middle;
    pointer-events: none;
}

.sofia:hover+.sofia-text {
    display: none;
}








.boeny:hover {
    fill: url(#BoenySar);
    stroke: white;
    stroke-width: 0.1px;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.boeny {
    fill: rgb(0, 255, 0);
    stroke: rgb(0, 255, 0);
    stroke-width: 1px;
}
.boeny-text {
    display: block;
    font-size: 45px;
    font-weight: bold;
    fill: black;
    text-anchor: middle;
    pointer-events: none;
}

.boeny:hover+.boeny-text {
    display: none;
}








.analanjirofo:hover {
    fill: url(#AnalanjirofoSar);
    stroke: white;
    stroke-width: 0.1px;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.analanjirofo {
    fill: rgb(255, 165, 0);
    stroke: rgb(255, 165, 0);
    stroke-width: 1px;
}

.analanjirofo-text {
    display: block;
    font-size: 40px;
    font-weight: bold;
    fill: black;
    text-anchor: middle;
    pointer-events: none;
}

.analanjirofo:hover+.analanjirofo-text {
    display: none;
}









.melaky:hover {
    fill: url(#MelakySar);
    stroke: white;
    stroke-width: 0.1px;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.melaky {
    fill: rgb(255, 0, 255);
    stroke: rgb(255, 0, 255);
    stroke-width: 1px;
}

.melaky-text {
    display: block;
    font-size: 45px;
    font-weight: bold;
    fill: black;
    text-anchor: middle;
    pointer-events: none;
}

.melaky:hover+.melaky-text {
    display: none;
}









.betsiboka:hover {
    fill: url(#BetsibokaSar);
    stroke: white;
    stroke-width:0.1px;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.betsiboka {
    fill: rgb(0, 255, 255);
    stroke: rgb(0, 255, 255);
    stroke-width: 1px;
}

.betsiboka-text {
    display: block;
    font-size: 40px;
    font-weight: bold;
    fill: black;
    text-anchor: middle;
    pointer-events: none;
}

.betsiboka:hover+.betsiboka-text {
    display: none;
}











.alaotramangoro:hover {
    fill: url(#AlaotramangoroSar);
    stroke: white;
    stroke-width: 0.1px;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.alaotramangoro {
    fill: rgb(255, 0, 0);
    stroke: rgb(255, 0, 0);
    stroke-width: 1px;
}

.alaotramangoro-text {
    display: block;
    font-size: 40px;
    font-weight: bold;
    fill: black;
    text-anchor: middle;
    pointer-events: none;
}

.alaotramangoro:hover+.alaotramangoro-text {
    display: none;
}










.menabe:hover {
    fill: url(#MenabeSar);
    stroke: white;
    stroke-width: 0.1px;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.menabe {
    fill: rgb(255, 165, 0);
    stroke: rgb(255, 165, 0);
    stroke-width: 1px;
}

.menabe-text {
    display: block;
    font-size: 40px;
    font-weight: bold;
    fill: black;
    text-anchor: middle;
    pointer-events: none;
}

.menabe:hover+.menabe-text {
    display: none;
}











.bongolava:hover {
    fill: url(#BongolavaSar);
    stroke: white;
    stroke-width: 0.1px;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.bongolava {
    fill: rgb(255, 255, 0);
    stroke: rgb(255, 255, 0);
    stroke-width: 1px;
}

.bongolava-text {
    display: block;
    font-size: 35px;
    font-weight: bold;
    fill: black;
    text-anchor: middle;
    pointer-events: none;
}

.bongolava:hover+.bongolava-text {
    display: none;
}















.analamanga:hover {
    fill: url(#AnalamangaSar);
    stroke: white;
    stroke-width: 0.1px;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.analamanga {
    fill: rgb(192, 192, 192);
    stroke: rgb(192, 192, 192);
    stroke-width: 1px;
}

.analamanga-text {
    display: block;
    font-size: 35px;
    font-weight: bold;
    fill: black;
    text-anchor: middle;
    pointer-events: none;
}

.analamanga:hover+.analamanga-text {
    display: none;
}











.itasy:hover {
    fill: url(#ItasySar);
    stroke: white;
    stroke-width: 0.1px;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.itasy {
    fill: rgb(255, 255, 255);
    stroke: rgb(255, 255, 255);
    stroke-width: 1px;
}

.itasy-text {
    display: block;
    font-size: 35px;
    font-weight: bold;
    fill: black;
    text-anchor: middle;
    pointer-events: none;
}

.itasy:hover+.itasy-text {
    display: none;
}











.vakinankaratra:hover {
    fill: url(#VakinankaratraSar);
    stroke: wheat;
    stroke-width: 0.1px;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.vakinankaratra {
    fill: rgb(0, 255, 0);
    stroke: rgb(0, 255, 0);
    stroke-width: 1px;
}

.vakinankaratra-text {
    display: block;
    font-size: 35px;
    font-weight: bold;
    fill: black;
    text-anchor: middle;
    pointer-events: none;
}

.vakinankaratra:hover+.vakinankaratra-text {
    display: none;
}















.atsinanana:hover {
    fill: url(#AtsinananaSar);
    stroke: white;
    stroke-width: 0.1px;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.atsinanana {
    fill: rgb(0, 0, 255);
    stroke: rgb(0, 0, 255);
    stroke-width: 1px;
}

.atsinanana-text {
    display: block;
    font-size: 40px;
    font-weight: bold;
    fill: black;
    text-anchor: middle;
    pointer-events: none;
}

.atsinanana:hover+.atsinanana-text {
    display: none;
}




















.amoronimania:hover {
    fill: url(#AmoronimaniaSar);
    stroke: white;
    stroke-width: 0.1px;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.amoronimania {
    fill: rgb(0, 255, 255);
    stroke: rgb(0, 255, 255);
    stroke-width: 1px;
}

.amoronimania-text {
    display: block;
    font-size: 30px;
    font-weight: bold;
    fill: black;
    text-anchor: middle;
    pointer-events: none;
}

.amoronimania:hover+.amoronimania-text {
    display: none;
}













.matsiatraambony:hover {
    fill: url(#MatsiatraambonySar);
    stroke: white;
    stroke-width: 0.1px;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.matsiatraambony {
    fill: rgb(255, 0, 0);
    stroke: rgb(255, 0, 0);
    stroke-width: 1px;
}

.matsiatraambony-text {
    display: block;
    font-size: 25px;
    font-weight: bold;
    fill: black;
    text-anchor: middle;
    pointer-events: none;
}

.matsiatraambony:hover+.matsiatraambony-text {
    display: none;
}


















.vatovavyfitovinany:hover {
    fill: url(#VatovavyfitovinanySar);
    stroke: white;
    stroke-width: 0.1px;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.vatovavyfitovinany {
    fill: rgb(255, 0, 255);
    stroke: rgb(255, 0, 255);
    stroke-width: 1px;
}

.vatovavyfitovinany-text {
    display: block;
    font-size: 30px;
    font-weight: bold;
    fill: black;
    text-anchor: middle;
    pointer-events: none;
}

.vatovavyfitovinany:hover+.vatovavyfitovinany-text {
    display: none;
}
















.ihorombe:hover {
    fill: url(#IhorombeSar);
    stroke: white;
    stroke-width: 0.1px;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.ihorombe {
    fill: rgb(255, 255, 0);
    stroke: rgb(255, 255, 0);
    stroke-width: 1px;
}

.ihorombe-text {
    display: block;
    font-size: 35px;
    font-weight: bold;
    fill: black;
    text-anchor: middle;
    pointer-events: none;
}

.ihorombe:hover+.ihorombe-text {
    display: none;
}













.atsimoandrefana:hover {
    fill: url(#AtsimoandrefanaSar);
    stroke: white;
    stroke-width: 0.1px;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.atsimoandrefana {
    fill: rgb(192, 192, 192);
    stroke: rgb(192, 192, 192);
    stroke-width: 1px;
}

.atsimoandrefana-text {
    display: block;
    font-size: 35px;
    font-weight: bold;
    fill: black;
    text-anchor: middle;
    pointer-events: none;
}

.atsimoandrefana:hover+.atsimoandrefana-text {
    display: none;
}












.androy:hover {
    fill: url(#AndroySar);
    stroke: white;
    stroke-width: 0.1px;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.androy {
    fill: rgb(0, 255, 0);
    stroke: rgb(0, 255, 0);
    stroke-width: 1px;
}

.androy-text {
    display: block;
    font-size: 30px;
    font-weight: bold;
    fill: black;
    text-anchor: middle;
    pointer-events: none;
}

.androy:hover+.androy-text {
    display: none;
}













.anosy:hover {
    fill: url(#AnosySar);
    stroke: white;
    stroke-width: 0.1px;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.anosy {
    fill: rgb(0, 0, 255);
    stroke: rgb(0, 0, 255);
    stroke-width: 1px;
}

.anosy-text {
    display: block;
    font-size: 35px;
    font-weight: bold;
    fill: black;
    text-anchor: middle;
    pointer-events: none;
}

.anosy:hover+.anosy-text {
    display: none;
}












.atsimoatsinanana:hover {
    fill: url(#AtsimoatsinananaSar);
    stroke: white;
    stroke-width: 0.1px;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.atsimoatsinanana {
    fill: rgb(255, 165, 0);
    stroke: rgb(255, 165, 0);
    stroke-width: 1px;
}

.atsimoatsinanana-text {
    display: block;
    font-size: 25px;
    font-weight: bold;
    fill: black;
    text-anchor: middle;
    pointer-events: none;
}

.atsimoatsinanana:hover+.atsimoatsinanana-text {
    display: none;
}